<template>
    <n-spin :show="isLoading" description="数据请求中..." style="background-color: #000">
        <n-card class="card-container">
            <n-form
                ref="formRef"
                :model="formData"
                label-placement="left"
                label-width="auto"
                require-mark-placement="right-hanging"
            >
                <n-form-item label="请求地址" path="path">
                    <n-input v-model:value="formData.path" placeholder="请输入路由" />
                </n-form-item>
                <n-form-item label="描述" path="description">
                    <n-input
                        v-model:value="formData.description"
                        placeholder="请输入描述"
                        disabled
                    />
                </n-form-item>
                <n-form-item label="请求方式" path="method">
                    <n-radio-group v-model:value="formData.method" name="method">
                        <n-space>
                            <n-radio value="get">get</n-radio>
                            <n-radio value="post">post</n-radio>
                            <n-radio value="put">put</n-radio>
                            <n-radio value="delete">delete</n-radio>
                        </n-space>
                    </n-radio-group>
                </n-form-item>
                <div class="form-btn-container">
                    <n-button type="primary" @click="handleSubmit">发送请求</n-button>
                </div>
            </n-form>
        </n-card>
        <n-input v-model:value="testResult" type="textarea" placeholder="测试结果" />
    </n-spin>
</template>

<script>
import { localStorageUtil } from "../../../utils/LocalStorageUtil";

export default {
    props: {
        datas: {
            type: Object,
        },
    },
    data() {
        const self = this;
        return {
            formData: {
                path: self.getPath(),
                method: self.datas.method,
                description: self.datas.description,
            },
            isLoading: true,
            testResult: "",
        };
    },
    mounted() {},
    methods: {
        getPath() {
            return (
                import.meta.env.VITE_BASE_URL + localStorageUtil.projectInfo.path + this.datas.path
            );
        },
        handleSubmit() {},
    },
};
</script>

<style scoped></style>
